
import React from 'react'

class WechatUserSettingEdit extends React.Component {
  constructor(props) {
    super(props)

    this.state = {
      data: {}
    }
  }

  componentWillReceiveProps(props) {
    this.setState({
      data: props.data
    })
  }

  pad(n) {
    return n < 10 ? "0"+n : n;
  }

  render() {
    var self = this;
    var bind_date = "",
        expire_date = "";
    if (this.state.data) {
      if (this.state.data.expire_date) {
        var date = new Date(this.state.data.expire_date);

        expire_date = date.getFullYear() + "-" + this.pad(date.getMonth() + 1) + "-"
                          + this.pad(date.getDate()) +"T"+"00:00:00";
      }
      var bind = this.state.data.created_at;
      bind_date = new Date(bind).toLocaleString();
    }
    var WechatUser = self.state.data.wechat_user,
        unit = self.state.data.unit
    return (
      <div className="modal fade" id="WechatUserSettingEdit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div className="modal-dialog" role="document">
          <div className="modal-content">
            <div className="modal-header">
              <button type="button" className="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 className="modal-title" id="WechatUser-modal-label">业主详情</h4>
            </div>
            <div className="modal-body">
              <div className="form-group">
                <label for="WechatUser-name">名字</label>
                <input ref="WechatUserName" type="text" className="form-control"
                        id="WechatUser-name" placeholder="名字" value={self.state.data.username}
                        onChange={(event)=>this.onChange(event, "name")} disabled/>
              </div>
              <div className="form-group">
                <label for="WechatUser-phone">联系方式</label>
                <input ref="WechatUserPhone" type="text" className="form-control"
                        id="WechatUser-phone" placeholder="联系方式" value={self.state.data.mobile}
                        onChange={(event)=>this.onChange(event, "mobile")} disabled/>
              </div>

              <div className="form-group">
                <label for="WechatUser-phone">户号</label>
                <input ref="WechatUserPhone" type="text" className="form-control"
                        id="WechatUser-phone" placeholder="户号" value={unit?unit.unit_desc:""}
                        onChange={(event)=>this.onChange(event, "reg_code")} disabled/>
              </div>
              <div className="form-group">
                <label for="WechatUser-phone">绑定时间</label>
                <input ref="WechatUserBindDate" type="text" className="form-control"
                        id="WechatUser-phone" placeholder="开始时间" value={bind_date}
                        onChange={(event)=>this.onChange(event, "bind_date")} disabled/>
              </div>
              <div className="form-group f-dn">
                <label for="WechatUser-phone">到期时间</label>
                <input ref="WechatUserPhone" type="datetime-local" className="form-control"
                        id="WechatUser-phone" placeholder="到期时间" value={expire_date}
                        onChange={(event)=>this.onChange(event, "expire_date")} disabled/>
              </div>
              <div className="form-group f-dn">
                <label for="WechatUser-phone">管家客服</label>
                <input ref="WechatUserPhone" type="text" className="form-control"
                        id="WechatUser-phone" placeholder="管家客服" value={(unit&&unit.sys_user)?(unit.sys_user.firstName+" "+unit.sys_user.lastName):""}
                        onChange={(event)=>this.onChange(event, "reg_code")} disabled/>
              </div>
              <input ref="WechatUserId" value={self.props.data.id} hidden/>
            </div>

          </div>
        </div>
      </div>
    )
  }
}

export default WechatUserSettingEdit
